<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="${pageContext.request.contextPath }/jsp/css/bootstrap.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath }/jsp/css/style.css" rel="stylesheet">
    <script src="${pageContext.request.contextPath }/jsp/js/jquery.min.js"></script>
    <script src="${pageContext.request.contextPath }/jsp/js/bootstrap.js"></script>
    <title>${merchant.mname }</title>
</head>
<body class="layout-background">
<nav class="navbar navbar-default nav-bar">
    <div class="layout-width" >
        <div class="navbar-header">
            <a href="./listMerchant" class="navbar-brand">ITA Order System</a>
        </div>
  		<div class="pull-right" style="font-size: 20px;position: relative;top: 10px;right: 55px;">
	        <c:choose>
	        	<c:when test="${user != null }">
		            <label class="control-label">Hello: </label>
		            <a href="#">${user.cname }</a>
		            <div style="margin-left: 70px;margin-top: -8px;">
		                <a class="btn btn-danger btn-xs" href="./logout">Logout</a>
		            </div>
	        	</c:when>
	        	<c:otherwise>
	        		<div style="margin-left: 70px;margin-top: -8px;">
		                <a class="btn btn-primary btn-sm" href="./login">Login</a>
		            </div>
	        	</c:otherwise>
	        </c:choose>
        </div>
    </div>
</nav>

<div class="layout-width merchant-list clearfix">
    <div style="text-align: center;">
        <h1>
            ${merchant.mname }
        </h1>
    </div>
    <div style="margin-left: 40px;margin-top: -40px;">
        <a href="./listMerchant" class="btn btn-default"><span class="glyphicon glyphicon-arrow-left"></span>Go Back</a>
    </div>
    <div style="margin: 40px 0 0 40px;">
        <img style="width: 400px;" src="http://10.222.232.146:9000/ita_order_system_merchant/${merchant.logo }">
    </div>
    <div style="font-size: 20px;position: relative;left: 45%;bottom: 250px;">
        <label class="control-label">Tel: </label> ${merchant.tel }<br/><br/>
        <label class="control-label">Address: </label> ${merchant.address }<br/><br/>
        <label class="control-label">Info: </label> ${merchant.info }<br/><br/>
    </div>
    <div style="margin-top: -150px;">
        <hr/>
        <h2 style="margin-left: 45px;">
            Dish List :
        </h2>
        <table class="table">
        <thead>
        <tr>
        	<td></td>
        	<td>Name</td>
        	<td>Price</td>
        	<td>Book</td>
        </tr>
        </thead>
        <tbody>
	        <c:forEach var="dish" items="${dishList}">
		        <tr>
		            <td width="25%"><img style="width: 100px;" src="http://10.222.232.146:9000/ita_order_system_merchant/${dish.img}"></td>
		            <td width="25%"><span>${dish.dname}</span></td>
		            <td width="25%"><span><fmt:formatNumber value="${dish.price}" pattern="¥#,###.00"></fmt:formatNumber></span></td>
		            <td width="25%"><span><a class="btn btn-primary">Book</a></span></td>
	        	</tr>
			</c:forEach>
        </tbody>
        </table>
    </div>
</div>

</body>
</html>